{% extends 'wxchat/wxbase.html' %}{% load static %}

{% block tabpanel %}
    <div class="weui-tab__content" style="display: block">
        <div class="weui-panel weui-panel_access">
            <div class="weui-panel__hd">
                <div class="weui-flex">
                    <div class="weui-flex__item"><span class="title">宠物医疗机构</span></div>
                    <div class="weui-flex__item"></div>
                    <div class="weui-flex__item"><a href="{% url 'dog-index' %}"><i class="icon iconfont icon-shouye2 pink r" ></i></a></div>
                </div>
            </div>
            <div class="weui-panel__bd" id="doginstitution"></div>
            <div class="weui-panel__ft" >
                <a href="javascript:void(0);" class="weui-cell weui-cell_access weui-cell_link" id="doginstitutionmore" style="display: none">
                    <div class="weui-cell__bd">查看更多</div>
                    <span class="weui-cell__ft"></span>
                </a>
            </div>
        </div>
    </div>
{% endblock tabpanel %}
 {% block tabbar %}
    <a href="{% url 'dog-index' %}" class="weui-tabbar__item">
        <div class="weui-tabbar__icon"><i class="icon iconfont icon-shouye2" ></i></div>
        <p class="weui-tabbar__label">首页</p>
    </a>
    <a href="javascript:void(0);" class="weui-tabbar__item" onclick="gotome();">
        <div class="weui-tabbar__icon"><i class="icon iconfont icon-wo2" ></i></div>
        <p class="weui-tabbar__label">我的</p>
    </a>
{% endblock tabbar %}
{% block add %}
    <a class="circle" href="{% url 'dog-institution-add' %}?next={{ request.get_full_path }}">
          <div class="circle_icon"><i class="icon iconfont icon-zengjia16"></i></div>
          <p>发布</p>
     </a>
{% endblock add %}
{% block bottomjs %}
    {{ block.super }}
  <script type="application/javascript">
     nextUrl = '{% url 'dog-institution-list' %}';
     var loading = weui.loading('加载中...');
     ///缓存滚动条位置
     $('.weui-tab__panel').scroll(function(){
            if($(this).scrollTop() !=0 ){
                sessionStorage.setItem('offsetTop',$(this).scrollTop());
            }
     });

    $(function(){
        $('#doginstitutionmore').on('click',function(){
            getDataList( nextUrl );
        });
        getDataList( nextUrl );
    });

    function getDataList(url){
        $.ajax({
          type: 'GET',
          url: url,
          dataType: 'json',
          timeout: 5000,
          context: $('#doginstitution'),
          success: function(data){
              nextUrl = data.next;
              appendItem(data.results);
              if(nextUrl == null)
                $('#doginstitutionmore').css('display','none');
              else
                 $('#doginstitutionmore').css('display','');
              loading.hide();
              setScollPos();
          },
          error: function(xhr, type,error){
              console.log(type);
          }
        });
    }

    function appendItem(results){
        $.each(results,function(index,item){
            var img_url = item.thumb_url;
            if(img_url == null){
                img_url = '<i class="icon iconfont icon-yiliaojigou1  weui-media-box__thumb" ></i>';
            }
            else {
                img_url = '<img class="weui-media-box__thumb" src="' + img_url + '">'
            }
            var listItem =  '<a href="/wechat/doginstitutiondetail/' + item.id + '" class="weui-media-box weui-media-box_appmsg">' +
                            '<div class="weui-media-box__hd">'+ img_url +'</div>'+
                            '<div class="weui-media-box__bd">' +
                               '<h4 class="weui-media-box__title">'+  item.name +'</h4>' +
                               '<ul class="weui-media-box__info">' +
								  '<li class="weui-media-box__info__meta">地址: ' + item.address + '</li>' +
								'</ul>' +
                               '<p class="weui-media-box__desc">简介: '+ item.brief +'</p>'  +
                             '</div>' +
                        '</a>';

            $('#doginstitution').append( listItem );
        }) ;
    }
    ////设置滚动条位置
    function setScollPos(){
        var _offset = sessionStorage.getItem("offsetTop");//获取滚动位置
        $('.weui-tab__panel').scrollTop(_offset);
    }

    function gotome(){
        sessionStorage.setItem('index',2);
        window.location.href = "{% url 'dog-index' %}";

    }

  </script>
{% endblock bottomjs %}
